import React from 'react';
import Router from 'react-routing/src/Router';

import App from './components/App';

import Resources from './components/Modules/Resources';
import Role from './components/Modules/Role';
import User from './components/Modules/User';
import Dictionaries from './components/Modules/Dictionaries';
import DervicesType from './components/Modules/DervicesType';
import Dervice from './components/Modules/Dervice';
import Loca from './components/Modules/Loca';
import Gateway from './components/Modules/Gateway';

import ContactPage from './components/ContactPage';
import NotFoundPage from './components/NotFoundPage';
import ErrorPage from './components/ErrorPage';

const router = new Router(on => {
  on('*', async (state, next) => {
    const component = await next();
    return component && <App context={state.context}>{component}</App>;
  });
  on('', async () => <Resources />);

  on('resources', async () => <Resources />);
  on('role', async () => <Role />);
  on('user', async () => <User />);
  on('dictionaries', async () => <Dictionaries />);
  on('dervicestype', async () => <DervicesType />);
  on('dervices', async () => <Dervice />);
  on('loca', async () => <Loca />);
  on('gateway', async () => <Gateway />);

  on('contact', async () => <ContactPage />);
  on('error', (state, error) => state.statusCode === 404 ?
    <App context={state.context} error={error}><ContactPage /></App> :
    <App context={state.context} error={error}><ContactPage /></App>
    //<App context={state.context} error={error}><NotFoundPage /></App> :
    //<App context={state.context} error={error}><ErrorPage /></App>
  );
});

export default router;
